import {Row,Col,Switch,Tag,DatePicker,Tabs,Icon,Form,Input,TimePicker} from 'antd';
import {WeaTableNew} from 'comsMobx';
const WeaTable = WeaTableNew.WeaTable;
import {WeaLocaleProvider} from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;
// import isEmpty from 'lodash/isEmpty';
let _this = null;

class Collapse extends React.Component {
    constructor(props) {
        super(props);
        _this = this;
        this.state = {
            showGroup: props.showGroup ? props.showGroup : false,
            title: props.title ? props.title : `${getLabel(384892,'请输入标题')}`,
        }
    }
    shouldComponentUpdate(nextProps, nextState) {
        //组件渲染控制
        //return this.props.title !== nextProps.title
        return true;
    }
    componentWillReceiveProps(nextProps) {
        if (this.props.showGroup !== nextProps.showGroup) {
            this.setState({showGroup: nextProps.showGroup});
        }
    }
    


    render() {
        const {showGroup,title} = this.state;
        let {customIcon = '',childrenStyle = {}} = this.props;
        childrenStyle = {...childrenStyle,paddingTop:'10px'}
        return (
            <div className="createWorkPlan-collapse" style={{padding:'16px 16px 0 16px'}}>
                <Row ecId={`${this && this.props && this.props.ecId || ''}_Row@jx09rk`} className="createWorkPlan-collapse-title" style={{
                  padding:'0 0 10px 0',borderBottom:'1px solid #ebebeb',
                  color:'#484848'
                }}>
                    <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@cmrrvr`} span="14">
                        <div style = {{/*fontSize:'12px',*/paddingLeft:'10px'}}>{title}</div>
                    </Col>
                    <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@x8eg9a`} span="10" style={{textAlign:"right",/*fontSize:12*/}}>
                        {customIcon &&
                            customIcon
                        }
                        <span className = {showGroup?"icon-coms-up":"icon-coms-down"} onClick={()=>this.setState({showGroup:!showGroup})} style={{paddingRight:'10px',color:'#B2B2B2',display:'inline-block',cursor:'pointer'}}/>
                    </Col>
                </Row>
                <Row ecId={`${this && this.props && this.props.ecId || ''}_Row@xbh9ds`} className="createWorkPlan-collapse-content" style={showGroup ? childrenStyle : {height:0,paddingTop:'20px',overflow:'hidden'}}>
                    {this.props.children}
                </Row>
            </div>
        )
    }

}

export default Collapse
